/*
 * @Author: your name
 * @Date: 2020-03-27 09:15:45
 * @LastEditTime: 2020-05-08 18:59:29
 * @LastEditors: wangchaoxu
 * @Description: In User Settings Edit
 * @FilePath: \weidun\postcss.config.js
 */
module.exports = {
  plugins: {
    'postcss-import': {}, //@import引入路径问题
    'postcss-url': {}, //处理文件，比如图片文件、字体文件等引用路径的处理。,配合上面
    'postcss-aspect-ratio-mini': {},
    'postcss-write-svg': {
      utf8: false,
    },
    'postcss-cssnext': {},
    'postcss-px-to-viewport': {
      viewportWidth: 3200, //  视窗的宽度，对应的是我们设计稿的宽度，移动端一般是750，如果是pc端那就是类似1920这样的尺寸
      viewportHeight: 1800, // 视窗的高度，移动端一般指定1334，也可以不配置
      unitPrecision: 3, // 指定`px`转换为视窗单位值的小数位数（很多时候无法整除）
      viewportUnit: 'vw', // 指定需要转换成的视窗单位，建议使用vw
      selectorBlackList: ['el-icon-more'], // 指定不转换为视窗单位的类，可以自定义，可以无限添加,建议定义一至两个通用的类名
      minPixelValue: 1, // 小于或等于`1px`不转换为视窗单位，你也可以设置为你想要的值
      mediaQuery: false, // 允许在媒体查询中转换`px`
    },
    'postcss-viewport-units': {
      // filterRule: rule => rule.nodes.findIndex(i => i.prop === 'content') === -1,
      //勉强解决伪元素的问题
      filterRule: rule => rule.selector.indexOf('::after') === -1 && rule.selector.indexOf('::before') === -1 && rule.selector.indexOf(':after') === -1 && rule.selector.indexOf(':before') === -1,
    },
    cssnano: {
      preset: 'default', // 设置成default将不会启用autoprefixer
      'postcss-zindex': false,
      autoprefixer: false,
    },
    /* 
      特别声明：由于cssnext和cssnano都具有autoprefixer,事实上只需要一个，所以把默认的autoprefixer删除掉，然后把cssnano中的autoprefixer设置为false。对于其他的插件使用，稍后会简单的介绍。
    */
  },
};
